<template>
  <div>
    <!-- <div class="top">
            <div class="top-icon" @click="jump">
                <font-awesome-icon icon="chevron-left" />
            </div>
            <div class="top-text">我的快递</div>
        </div> -->
    <van-nav-bar title="我的快递"
                 left-text=""
                 left-arrow
                 @click-left="jump">
    </van-nav-bar>
    <div class="mid">
      <el-tabs v-model="activeName">
        <el-tab-pane label="全部"
                     name="first">
          <div class="bottom">
            <div class="order-pic">
              <img v-bind:src="require('../../assets/images/MineImages/post.jpg')"
                   class="order-pic">
            </div>
            <div class="order-text">
              啊哦~没有相关的快递消息
            </div>
          </div>
        </el-tab-pane>
        <el-tab-pane label="待签收"
                     name="second">
          <div class="bottom">
            <div class="order-pic">
              <img v-bind:src="require('../../assets/images/MineImages/post.jpg')"
                   class="order-pic">
            </div>
            <div class="order-text">
              啊哦~没有相关的快递消息
            </div>
          </div>
        </el-tab-pane>
        <el-tab-pane label="已签收"
                     name="third">
          <div class="bottom">
            <div class="order-pic">
              <img v-bind:src="require('../../assets/images/MineImages/post.jpg')"
                   class="order-pic">
            </div>
            <div class="order-text">
              啊哦~没有相关的快递消息
            </div>
          </div>
        </el-tab-pane>
      </el-tabs>
    </div>
  </div>
</template>

<script>
export default {
  data () {
    return {
      activeName: 'first'
    }
  },
  methods: {
    jump () {
      this.$router.push({ path: '/Mine' })
    }
  }
}
</script>

<style scoped>
.top-icon {
  margin-left: 25px;
  margin-top: 25px;
}
.top-calendar {
  position: relative;
  right: 25px;
  float: right;
}
.top-text {
  font-size: 1.5rem;
  font-weight: bold;
  margin-left: 25px;
  margin-top: 10px;
}
.mid {
  padding: 25px;
}
.bottom {
  position: relative;
  margin-top: 50%;
}
.order-text {
  text-align: center;
  font-size: 0.9rem;
  color: rgba(128, 128, 128, 0.445);
}
.order-pic {
  width: 200px;
  height: 100px;
  margin: 0 auto;
}
.van-nav-bar {
  background-color: rgb(114, 202, 205);
}
::v-deep .van-icon,
::v-deep .van-nav-bar__text,
::v-deep .van-ellipsis {
  color: #fff;
}
</style>
